<template>
	<view class="login">
		<view class="headtop">
			<view class="title">
				<image :src="image" class="logo"></image>
				<view class="name">
					欢迎登录{{x_name}}
				</view>
			</view>
		</view>
		<view class="footer">
			<view class="denglu">
				<button open-type="getUserProfile" @click="getUserProfile" v-if="status == 0">微信一键登录</button>
				<button type='primary' open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"
					v-if="phone_status == 1 && status == 1">手机号授权</button>
			</view>
			<view class="quxiao" @click="fanhui">暂不登录</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				baseUrl: getApp().globalData.baseUrl,
				x_name: '',
				image: '',
				x_desc: '',
				status: 0,
				phone_status: '',
				session_key: '',
				openid: '',
				unionid: '',
			}
		},
		onLoad() {

			//获取基本配置信息
			this.request({
				url: '/xcx/webconfig',
				data: {}
			}).then(res => {
				if (res.data.code == 200) {
					this.x_name = res.data.data.x_name;
					this.image = res.data.data.image;
					this.x_desc = res.data.data.x_desc;
					this.phone_status = res.data.data.phone_status;
				} else {
					uni.showToast({
						title: '请求失败，请稍后再试',
						icon: 'none'
					})
				}
			})

			// 获取code
			this.getCode();
		},
		methods: {
			getCode() {
				let that = this;
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						that.request({
							url: '/xcxlogin/wxLogin',
							data: {
								code: loginRes.code
							}
						}).then(res => {
							that.session_key = res.data.data.session_key;
							that.openid = res.data.data.openid;
							if(res.data.data.unionid){
								that.unionid = res.data.data.unionid;
							}
						})
					},
				})
			},
			getUserProfile(e) {
				let that = this;
				
				if(that.hidden == false){
					uni.showToast({
						title: '请先勾选同意协议',
						icon: 'none'
					})
					
					return;
				}
				
				uni.getUserInfo({
					provider: 'weixin',
					success: (res) => {
						that.request({
							url: '/xcxlogin/wxdecrypt',
							data: {
								"openid": that.openid,
								"unionid": that.unionid,
								"session_key": that.session_key,
								"encryptedData": res.encryptedData,
								"iv": res.iv,
							},
							method: "POST"
						}).then(res1 => {
							if (res1.data.code == 200) {
								if(that.phone_status == 1){
									that.status = 1;
								}else{
									uni.showToast({
										title: '登录成功',
										icon: 'none'
									})
									uni.setStorageSync('user_id', res1.data.data)
									setTimeout(function() {
										uni.reLaunch({
											url: '/pages/index/index'
										})
									}, 2000)
								}
							}
						})
					},
					fail(res) {
						console.log(res)
					}
				})
			},

			getPhoneNumber(e) {
				let that = this;
				// 根据你的需求处理获取到的手机号信息
				if (e.detail.errMsg == 'getPhoneNumber:ok') {
					
					that.request({
						url: '/xcxlogin/getCode',
						data: {
							'encryptedData': encodeURIComponent(e.detail.encryptedData),
							'iv': e.detail.iv,
							'session_key': that.session_key
						},
						method: "POST"
					}).then(res1 => {
						console.log(res1)
						that.request({
							url: '/xcxlogin/wxPhoneDecrypt',
							data: {
								"openid": that.openid,
								"mobile": res1.data.phoneNumber
							},
							method: "POST"
						}).then(res2 => {
							if (res2.data.code == 200) {
								uni.showToast({
									title: '登录成功',
									icon: 'none'
								})
								uni.setStorageSync('user_id', res2.data.data)
								setTimeout(function() {
									uni.reLaunch({
										url: '/pages/index/index'
									})
								}, 2000)
							}
						})
					})
				}
			},
			topage(url) {
				uni.navigateTo({
					url
				})
			},
			//返回
			fanhui() {
				uni.reLaunch({
					url: '/pages/index/index'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.login {
		width: 100%;
		margin: 0 auto;
		height: 100vh;

		.headtop {
			width: 100%;
			margin: 0 auto;

			.title {
				width: 100%;
				margin: 0 auto;
				text-align: center;

				.logo {
					width: 160rpx;
					height: 160rpx;
					margin-top: 200rpx;
				}

				.name {
					font-size: 44rpx;
					color: #333333;
					font-weight: 700;
				}
			}
		}

		.footer {
			position: fixed;
			bottom: 200rpx;
			left: 0;
			width: 100%;
			text-align: center;

			.denglu {
				width: 80%;
				margin: 0 auto 30rpx;
				height: 88rpx;
				line-height: 88rpx;
				text-align: center;
				background: #00D6C0;
				color: #ffffff;
				font-size: 32rpx;
				border-radius: 44rpx;

				button {
					width: 100%;
					height: 88rpx;
					line-height: 88rpx;
					border-radius: 44rpx;
					background: #00D6C0;
					color: #ffffff;
					font-size: 32rpx;
				}
			}

			.quxiao {
				width: 80%;
				margin: 0 auto 30rpx;
				height: 88rpx;
				line-height: 88rpx;
				text-align: center;
				background: #EEEFF1;
				color: #9D9D9D;
				font-size: 32rpx;
				border-radius: 44rpx;
			}
		}
	}
</style>